{block name="circle_layout"}
	{include file="common:common_layout"}
{/block}
{extend name="common/layout" /}
{block name="style"}{/block}
{block name="content"}
<div class="add-group">
    <dl class="top-box">
        <dt>
        <h3>创建一个圈子<i>欢迎你先在 <a href="{:url('circle/search/group')}">发现精彩</a> 发现喜欢的圈子</i></h3>
        <p>欢迎在<?php echo sysconf('circle_name');?>这个快乐和谐的地方，聚集和你爱好相同，品位相当的好朋友，畅谈交流，分享心情，享受生活！</p>
        </dt>
        <dd><span>最多可创建圈子数：<em><?php echo sysconf('circle_createsum');?></em></span><span>已经创建圈子数:<em><?php echo $create_count;?></em></span></dd>
        <dd><span>最多可加入圈子数：<em><?php echo sysconf('circle_joinsum');?></em></span><span>已经加入圈子数:<em><?php echo $join_count;?></em></span></dd>
    </dl>
    <div class="base-form-style">
        <form method="post" id="groupadd_form" action="{:url('circle/index/add_group')}?t=1">
            <input type="hidden" name="form_submit" value="ok" />
            <dl>
                <dt class=""><em></em>所属类目:</dt>
                <dd class="group-classes">
                    <?php if(!empty($class_list)){?>
                    <ul>
                        <?php foreach(($class_list) as $val){?>
                        <li class="fl mr20 mb5">
                            <input type="radio" name="class_id" value="<?php echo $val['class_id'];?>" />
                            <h5><?php echo $val['class_name'];?></h5></li>
                        <?php }?>
                    </ul>
                    <?php }?>
                    <p class="field_notice"></p>
                    <div class="hint">根据您的圈子主题类型，选择适当的分类。</div>
                </dd>
            </dl>
            <dl>
                <dt class="required"><em></em>圈子名称:</dt>
                <dd>
                    <p>
                        <input type="text" name="c_name" id="c_name" class="text w400" value="<?php echo I('get.kw');?>" />
                    </p>
                    <p class="field_notice"></p>
                    <div class="hint">圈子名称规定使用4~12个字符，确定后不可修改。</div>
                </dd>
            </dl>
            <dl>
                <dt>圈子简介:</dt>
                <dd>
                    <p>
                        <textarea name="c_desc" id="c_desc" class="textarea w400 h100"></textarea>
                        <span class="count" id="desccharcount"></span>
                    </p>
                    <p class="field_notice"></p>
                    <div class="hint">对您建立的圈子进行简单的文字介绍，创建后圈主可做修改，字数不超过255字。</div>
                </dd>
            </dl>
            <dl>
                <dt>圈子标签：</dt>
                <dd>
                    <p>
                        <input type="text" name="c_tag" class="text w400" />
                    </p>
                    <p class="field_notice"></p>
                    <div class="hint">建立圈子标签有利于全局搜索查找到您的圈子，多个标签请用&quot;,&quot;进行分隔。</div>
                </dd>
            </dl>
            <dl>
                <dt>申请理由：</dt>
                <dd>
                    <p>
                        <textarea name="c_pursuereason" id="c_pursuereason" class="textarea w400 h100"></textarea>
                        <span class="count" id="pursuereasoncharcount"></span>
                    </p>
                    <p class="field_notice"></p>
                    <div class="hint">认真填写申请圈子的理由提交至平台，以确保管理人员及时审核并通过，字数不要超过255字。</div>
                </dd>
            </dl>
            <dl>
                <dt>&nbsp;</dt>
                <dd>
                    <input type="checkbox" checked="checked" />
                    我已认真阅读并同意《<a target="_blank" href="{:url('home/document/index',array('code'=>'create_circle'))}">圈子使用须知</a>》中的所有条款</dd>
            </dl>
            <dl class="bottom">
                <dt>&nbsp;</dt>
                <dd><a class="submit-btn" nctype="submit-btn" href="Javascript: void(0)">提交申请</a></dd>
            </dl>
        </form>
    </div>
</div>
<script type="text/javascript" src="__SITE_RESOURCE__/js/jquery.charCount.js"></script>
<script type="text/javascript" src="__SITE_RESOURCE__/js/jquery.validation.min.js"></script>
<script type="text/javascript">
    $(function(){
        $('a[nctype="submit-btn"]').click(function(){
            $('#groupadd_form').submit();
        });
        $('#groupadd_form').validate({
            errorPlacement: function(error, element){
                $(element).parents('dd:first').children('.field_notice').html(error);
            },
            submitHandler:function(form){
                ajaxpost('groupadd_form', "{:url('circle/index/add_group')}?t=1", '', 'onerror');
            },
            rules : {
                c_name : {
                    required : true,
                    minlength : 4,
                    maxlength : 12,
                    remote : {
                        url : "{:url('circle/index/check_circle_name')}",
                        type: 'get',
                        data:{
                            name : function(){
                                return $('#c_name').val();
                            }
                        }
                    }
                },
                c_desc : {
                    maxlength : 255
                },
                c_tag : {
                    maxlength : 60
                },
                c_pursuereason : {
                    maxlength : 255
                }
            },
            messages : {
                c_name : {
                    required : '请填写圈子名称',
                    minlength : '圈子名称4到12个字符之间',
                    maxlength : '圈子名称4到12个字符之间',
                    remote : '该名称已存在，请更换一个名称'
                },
                c_desc  : {
                    maxlength : '不能超过255个字符'
                },
                c_tag : {
                    maxlength : '不能超过255个字符'
                },
                c_pursuereason : {
                    maxlength : '不能超过255个字符'
                }
            }
        });
        //字符个数动态计算
        $("#c_desc").charCount({
            allowed: 255,
            warning: 10,
            counterContainerID:'desccharcount',
            firstCounterText:'还可以输入',
            endCounterText:'字',
            errorCounterText:'已经超出'
        });
        //字符个数动态计算
        $("#c_pursuereason").charCount({
            allowed: 255,
            warning: 10,
            counterContainerID:'pursuereasoncharcount',
            firstCounterText:'还可以输入',
            endCounterText:'字',
            errorCounterText:'已经超出'
        });
    });
</script>
{/block}